<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>地图</title>
</head>
<body>
<div id="container"></div>
<script src="https://webapi.amap.com/loader.js"></script>
<!-- 地圖 -->
<script type="text/javascript">
    window._AMapSecurityConfig = {
        securityJsCode: '90d2fea971ab8c0c5ef2c802ee3daec2',
    }

    AMapLoader.load({
        key: "301ca7643e65e866129840e9d72c72ec", // 申请好的Web端开发者Key，首次调用 load 时必填
        version: "2.0", // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
        plugins: ['AMap.Driving'], // 需要使用的的插件列表，如比例尺'AMap.Scale'等
        AMapUI: { // 是否加载 AMapUI，缺省不加载
            "version": '1.1', // AMapUI 版本
            "plugins": ['overlay/SimpleMarker'], // 需要加载的 AMapUI ui插件
        },
        Loca: { // 是否加载 Loca， 缺省不加载
            "version": '2.0' // Loca 版本
        }
    }).then((AMap) => {
        // JS API加载完成后获取AMap对象
        var map = new AMap.Map('container', {
            center: [118.787326, 32.053766],
            zoom: 13 //地图显示的缩放级别
        });
    })

    // 根据经纬度标记地理位置
    var marker = new AMap.Marker({
        position: new AMap.LngLat(118.787326, 32.053766),
        title: '默认图标' //可以自定义icon图标展示
    })
    // 将创建的点标记添加到已有的地图实例
    map.add(marker)

</script>


</body>
</html>